<section>
  <d-button bsStyle="common" (click)="loadMenu = !loadMenu">异步加载菜单</d-button>
  <d-button bsStyle="common" (click)="loadContent = !loadContent">异步加载内容</d-button>
  <p>点击切换异步加载内容</p>
  <div dAnchorBox [view]="{top: 60, bottom: 0}" [defaultAnchor]="'base-info'"
    class="mymain" style="position:relative; min-height:220px;">
    <div class="mysidebar" *ngIf="loadMenu">
      <d-sticky [view]="{top: 60, bottom: 0}" >
        <ul class="step-nav">
          <li [dAnchorLink]="'base-info'" anchorActive="active">基本信息</li>
          <li [dAnchorLink]="'issue-list'" anchorActive="active">需求列表</li>
          <li [dAnchorLink]="'case-list'" anchorActive="active">用例列表</li>
          <li [dAnchorLink]="'quarlity-result'" anchorActive="active">质量评估</li>
        </ul>
      </d-sticky>
    </div>
    <div class="mycontent" *ngIf="loadContent">
      <div [dAnchor]="'base-info'" class="section-block">
        <h3>基本信息</h3>
        这里显示基本信息。
      </div>
      <div [dAnchor]="'issue-list'" class="section-block">
        <h3>需求列表</h3>
        这里显示需求列表。
      </div>
      <div [dAnchor]="'case-list'" class="section-block">
        <h3>用例列表</h3>
        这里显示用例列表。
      </div>
      <div [dAnchor]="'quarlity-result'" class="section-block">
        <h3>质量评估</h3>
        这里显示质量评估。
      </div>
    </div>
  </div>
</section>
